import React, { Component } from 'react';
import  axios from 'axios'

import bannerIMg from '../static/images/meet-banner.png'

class Meet extends Component {
    constructor(props) {
        super (props)
        this.state = {
            meetData: []
        }
    }
    componentWillMount () {
        let that = this, content = []
        axios.get('http://80days.lockinchina.com/apib/eightyDay/getJson')
        .then((res)=>{
            const data = res.data
            if (data.code === 200) {
                content = JSON.parse(data.employers)
                that.setState({
                    meetData: [...content]
                })
            }
        })
    }
    render () {
        return (
            <div>
                {/* {console.log(this.state.meetData)} */}
                <div className="meet-banner"><img alt = "meet-banner" src = {bannerIMg} /></div>
                <div className="video-content" style={{display: 'none'}}>
                    <video controls="controls" controlsList="nodownload nofullscreen" style={{ 'width': '100%', 'height': '100%'}} >
                        {/* <source src="https://media.w3.org/2010/05/sintel/trailer.mp4" type="video/mp4" /> */}
                    </video>
                </div>
                <div className="weltxt">
                    <p>在这个海外校招季    </p>
                    <p>Lockin 邀请中国各个行业的领头羊企业</p>
                    <p>向全球青年人才展示中国企业品牌实力</p>
                    <p>吸引全球青年人才跟随</p>
                    <div style={{'height': '.2rem'}}></div>
                    <p>在这里，</p>
                    <p>你能得到最真诚的邀请</p>
                </div>
                <ul className="meet-list">
                    {this.getMeetList()}
                </ul>
            </div>
        )
    }
    getMeetList() {
        let meet = this.state.meetData;
        return meet.map((item, index) => {
            return (
                <li key={index}
                    onClick={ item.link && ( () =>  window.location = `${item.link}` ) }    
                >
                    <img className="im" src={item.header} alt="" />
                    <p className="name">{item.name}</p>
                    <div className="tit">
                        <p>{item.companyName}</p>
                        <p>{item.title}</p>
                    </div>
                    <p className="txt">{item.description}</p>
                    <img className="comlogo" src={item.logo} alt="" />
                </li>
            )
        })
    }
}

export default Meet;